<style>
    /*KORISNICKI NALOG*/
    #prijavna-forma{ 
        /*width: 540px;
        margin: 0 auto;*/
        font-family: tahoma,arial;
    }
    .objasnjenje{
        color: rgb(170, 170, 170); 
        font-size: 11px; 
        font-style: italic; 
        padding: 0 0 8px 0; 
    }
    #nalog-strana {
        float: right;
        margin: -63px 0 0;
        width: 360px;
    }
    #info{
        color: red;
    }
    .korisnicki-nalog input {
        font-size: 14px;
        line-height: 120%;
        padding: 1px;
        width: 220px;
        border: 1px solid #CCCCCC;
    }
    .korisnicki-nalog label {
        color: #333333;
        font-size: 10px; 
        font-weight: bold; 
        text-transform: uppercase;  
    }

    .korisnicki-nalog select {
        font-size: 14px;
        padding: 0;
        width: 224px;
        border: 1px solid #CCCCCC; 
        line-height: 120%;    
    }     
    #after_submit_errors{
        border: 1px solid;
        color: red;
        display: none;
        margin-top: 15px;
        padding: 5px;
        text-align: left;
    }
    #after_submit_errors h1{
        background: none;
        padding: 0 15px 15px 0;
        margin: 0;
        color: #333333;
        font-size: 18px;
        font-weight: normal;
        margin-bottom: 10px;
    }
    #after_submit_errors p{
        margin: 0;
        padding : 0;
    }

    .register{
        background: none repeat scroll 0 0 #FFFFFF;
        border: 1px solid #DFDEDE;
        padding: 16px;
        margin-top: 13px;
        text-align: left;
    }
    .register p{
        color: #6B6A6A;
        padding: 2px 0;
    }
    .required{
        border: 1px solid #999999;
        border-left :none ;
        border-right  :none ;
        padding: 8px 0;
        margin: 6px 0 0 0;
        color: #6B6A6A;
        font-size: 12px;
        font-weight: bold;
    }
    .register h2{
        font-size: 18px;
        font-weight: normal;
        margin-bottom: 10px;
        color: #333333;
    }
    .error{
        font-size: 18px;
        font-weight: normal;
        margin-bottom: 10px;
        color: #333333;
    }
    .register table tr{
        line-height: 46px;
    }
    .register table tr td{ 
        border-top: 1px solid #DFDEDE;
        text-align: left;
    }
    .qoptionssmlbuttons {
        padding: 13px 16px;
    }
    .qoptions, .qoptionspaging {
        background: url(<?=base_url()?>assets/img/backgrounds/qfootbg.png) repeat-x scroll left top #F1EFEC;
        border-bottom: 1px solid #CCCBCA;
        border-top: 1px solid #CCCBCA;
        padding: 13px 50px;
    }
    .button, .button-red, .button-red-big {
        -moz-border-radius: 11px 11px 11px 11px;
        background: url(<?=base_url()?>assets/img/backgrounds/butregularbg.png) repeat-x scroll left top transparent;
        color: #FFFFFF;
        cursor: pointer;
        float: left;
        font-size: 12px;
        font-weight: 600;
        line-height: 12px !important;
        padding: 4px 16px 6px;
        text-shadow: 0 1px 1px #00263C;
    }
    .button:hover{
        background-position:left bottom;
    }
    .right {
        float: right !important;
    }
    .clear {
        clear: both;
        font-size: 0;
        height: 0;
        line-height: 0;
    }
    .divider {
        height: 30px;
    }
    a:hover{
        text-decoration:none;
    }
    .sidebar{
        width: 296px;
        border: none;
        margin-left: 10px;
    }
    .sidebar .box {
        -moz-border-radius: 2px 2px 2px 2px;
        background: none repeat scroll 0 0 #FFFFFF;
        border: 1px solid #EDEDED;
        padding: 1px;
    }
    .sidebar .box .grey {
        background: none repeat scroll 0 0 #F7F7F7;
    }
    .sidebar .pad {
        padding: 10px 12px;
    }
    .sidebar .box h5 {
        color: #6B6A6A;
        font-size: 16px;
        font-weight: normal;
        margin: 0;
        padding: 0;
    }
    .sidebar .box .grey-div {
        background: none repeat scroll 0 0 #FFFFFF;
        border-top: 1px solid #DEDFDE;
        height: 1px;
    }
    .sidebar .box p {
        color: #6B6A6A;
        line-height: 18px;
        margin: 0;
        padding: 12px;
    }
    .sidebar .box-div {
        height: 10px;
    }
    .box ul {
        margin: 0 15px;
        padding: 0;
        padding-bottom: 8px;
    }
    .box ul li.check {
        background: url(<?=base_url()?>assets/img/backgrounds/check.gif) no-repeat scroll 0 0 transparent;
        margin: 6px 0;
        padding-left: 20px;        
    }
    .login{
        float: right;
    }
    .login a{
        color: #333333;
    }
    .red{
        color:red;
    }

    #prijavna-forma label.error {
        margin-left: 5px;
        width: auto;
        display: inline;
        color:red;
        text-transform: capitalize;
        font-weight: bold;
    }
    input.error {
        border: 1px dotted red;
    }
    #business{
        float:right;
        margin: 30px 15px 0 0;
    }
    .business{
        float: left;
    }
    .business_check{
        float: left;
        display: block;
        margin: 0 25px 0 0 ;
    }
    #ajax_loader {
        background: url(<?=base_url()?>assets/img/backgrounds/vote-loader-eeeeee.gif) no-repeat center center transparent;
        margin: 2px 5px 0 0;
        width: 20px;       
        height: 20px;
        float: right;
        display: none;       
    }
</style> 
<script type="text/javascript" src="http://localhost/logicsol_poll/assets/js/nalog/jquery.validate.js"></script>
<script type="text/javascript" src="http://localhost/logicsol_poll/assets/js/nalog/kreiraj-nalog.js"></script>
<script type="text/javascript">
    $('.inputbox').live('focus',function(){
        $(this).css({
            'border-color':'#CCCBCA',
            'background-color':'#EFEFEF'

        });
    });

    $('.inputbox').live('blur',function(){
        $(this).css({
            'border-color':'',
            'background':'none'
        });
    });
    $('#business_check').change(function() {
        if ($('#business_check').is(':checked')) {$('#cmpn').show() } else { $('#cmpn').hide();}

    });
</script>
<form action="javascript:void(0)" method="GET" id="prijavna-forma" name="prijavna-forma">

    <div id="after_submit_errors"></div>
    <div class="register">
        <div id="business">            
            <input type="checkbox" name="business_check" id="business_check" class="business_check" checked="checked">
            <label for="business_check"><span class="business">Označite ako ste firma</span></label>
        </div>
        <h2>Prijavna forma</h2>
        <p>Molimo unesite vaše podatke.</p>    

        <div class="required">Polja označena sa <span class="red">*</span> su obavezna.</div>

        <div class="korisnicki-nalog">
            <div style="display: none; margin-bottom: 10px; font-style: italic;" id="info"></div>


            <table cellpadding="0" cellspacing="0">
            <tr id="cmpn">
                <td style="width: 130px; border-top: none;" ><label>Naziv firme:</label></td>
                <td style="width: 440px; border-top: none;"><input type="text" value="" name="company" id="company" class="inputbox"></td>
            </tr>
        </div>
        <tr>
            <td style="width: 130px;"><label><span class="red">*</span>Vaše ime:</label></td>
            <td><input type="text" value="" name="firstname" id="firstname" class="inputbox"></td>
        </tr>
        <tr>
            <td style="width: 130px;"><label><span class="red">*</span>Vaše prezime:</label></td>
            <td><input type="text" value="" name="lastname" class="inputbox"></td>
        </tr>
        <tr>
            <td style="width: 130px;"><label><span class="red">*</span>Vaša adresa:</label></td>
            <td><input type="text" value="" name="address1" class="inputbox"></td>
        </tr>
        <tr>
            <td style="width: 130px;"><label><span class="red">*</span>Poštanski broj:</label></td>
            <td><input type="text" value="" name="zip" class="inputbox"></td>
        </tr>
        <tr>
            <td style="width: 130px;"><label><span class="red">*</span>Grad:</label></td>
            <td><input type="text" value="" name="city" class="inputbox"></td>
        </tr>
        <tr>
            <td style="width: 130px;"><label><span class="red">*</span>Država:</label></td>
            <td>
                <select name="country_ccode" id="country_ccode" validate="required:true">
                    <option value="0">--- Odaberi sa liste</option>
                    <?
                        foreach($drzave as $drzava){
                        ?><option value="<?=$drzava->ccode;?>"><?=$drzava->name?></option><?    
                        }
                    ?>
                </select>
            </td>
        </tr>

        </table>                  
    </div>
    </div>
    <div class="register" style="margin-top: 20px;">
        <div class="korisnicki-nalog">
            <h2>Pristupni podatci</h2>
            <p style="margin-bottom: 8px;">Molimo unesite vaše podatke za buduću prijavu na sistem.</p>

            <table cellpadding="0" cellspacing="0">
                <tr>
                    <td style="width: 130px;"><label><span class="red">*</span>Email:</label></td>
                    <td style="width: 440px;"><input type="text" value="" name="email" class="email"></td>
                </tr>
                <tr>
                    <td style="width: 130px;"><label><span class="red">*</span>Lozinka:</label></td>
                    <td><input type="password" value="" name="password_one" class="" id="password_one"></td>
                </tr>
                <tr>
                    <td style="width: 130px;"><label><span class="red">*</span>Re-Lozinka:</label></td>
                    <td><input type="password" value="" name="password_conf" class=""></td>
                </tr>
            </table>

        </div>
    </div>

    <div class="divider"></div>

    <div class="qoptions qoptionssmlbuttons">
        <div class="right">               
            <a href="javascript:void(0)" class="button" id="submit-form">Kreiraj nalog</a>
            <div class="clear"></div> 
        </div>
        <div id="ajax_loader">&nbsp;</div> 
        <div class="clear"></div>
    </div>

</form>